/* /Pages/ShareAccess.razor.rz.scp.css */
/* Matches the password-share email template (PasswordShareEmail.html): white card on
   light-grey, green brand accent bar (#93c355), Arial/Helvetica typography, rounded
   corners, clean buttons. No MudBlazor on this page — recipient is external. */

.share-page[b-yid1wzsy40] {
    min-height: 100vh;
    background: #f5f5f5;
    font-family: Arial, Helvetica, sans-serif;
    color: #1f2937;
    padding: 28px 12px;
    display: flex;
    justify-content: center;
    align-items: flex-start;
}

.share-card[b-yid1wzsy40] {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    width: 100%;
    max-width: 560px;
    overflow: hidden;
}

.share-card-accent[b-yid1wzsy40] {
    height: 4px;
    background: #93c355;
}

.share-card-header[b-yid1wzsy40] {
    padding: 22px 24px 14px;
}

.share-brand[b-yid1wzsy40] {
    font-size: 12px;
    color: #6b7280;
    text-transform: lowercase;
    letter-spacing: 0.02em;
}

.share-card-header h1[b-yid1wzsy40] {
    margin: 6px 0 0;
    font-size: 18px;
    font-weight: 700;
    color: #111827;
}

.share-meta[b-yid1wzsy40] {
    margin: 0 24px 14px;
    padding: 10px 12px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    font-size: 13px;
    color: #374151;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
}

.badge[b-yid1wzsy40] {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 600;
}

.badge-warn[b-yid1wzsy40] {
    background: #fef3c7;
    color: #92400e;
    border: 1px solid #f59e0b;
}

.banner[b-yid1wzsy40] {
    margin: 0 24px 14px;
    padding: 10px 12px;
    border-radius: 8px;
    font-size: 13px;
    border: 1px solid;
}

.banner-error[b-yid1wzsy40] {
    background: #fff1f2;
    border-color: #fda4af;
    color: #9f1239;
}

.banner-info[b-yid1wzsy40] {
    background: #ecfdf5;
    border-color: #6ee7b7;
    color: #065f46;
}

.share-step[b-yid1wzsy40] {
    padding: 8px 24px 24px;
}

.share-step h2[b-yid1wzsy40] {
    margin: 0 0 8px;
    font-size: 15px;
    font-weight: 700;
    color: #111827;
}

.share-step p[b-yid1wzsy40] {
    margin: 0 0 12px;
    font-size: 13px;
    color: #374151;
    line-height: 1.5;
}

.share-step p.hint[b-yid1wzsy40] {
    margin-top: 14px;
    font-size: 11px;
    color: #6b7280;
}

.masked-email[b-yid1wzsy40] {
    margin: 12px 0 18px;
    padding: 14px 16px;
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    font-family: Consolas, ui-monospace, monospace;
    font-size: 14px;
    color: #111827;
    text-align: center;
}

.btn-primary[b-yid1wzsy40] {
    background: #93c355;
    color: #ffffff;
    border: 0;
    border-radius: 8px;
    padding: 11px 18px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    transition: filter 0.15s ease;
}

.btn-primary:hover:not(:disabled)[b-yid1wzsy40] {
    filter: brightness(0.95);
}

.btn-primary:disabled[b-yid1wzsy40] {
    cursor: not-allowed;
    opacity: 0.6;
}

.btn-link[b-yid1wzsy40] {
    margin-left: 10px;
    background: transparent;
    border: 0;
    color: #2563eb;
    font-size: 12px;
    text-decoration: underline;
    cursor: pointer;
}

.btn-link:disabled[b-yid1wzsy40] {
    cursor: not-allowed;
    opacity: 0.5;
}

.code-input[b-yid1wzsy40] {
    display: block;
    width: 100%;
    max-width: 260px;
    margin: 0 0 14px;
    padding: 10px 12px;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    font-family: Consolas, ui-monospace, monospace;
    font-size: 22px;
    text-align: center;
    letter-spacing: 0.4em;
    color: #111827;
}

.code-input:focus[b-yid1wzsy40] {
    outline: none;
    border-color: #93c355;
    box-shadow: 0 0 0 3px rgba(147, 195, 85, 0.25);
}

.spinner[b-yid1wzsy40] {
    display: inline-block;
    width: 12px;
    height: 12px;
    margin-right: 8px;
    border: 2px solid #ffffff;
    border-top-color: transparent;
    border-radius: 50%;
    animation: spin-b-yid1wzsy40 0.7s linear infinite;
    vertical-align: -2px;
}

@keyframes spin-b-yid1wzsy40 {
    to { transform: rotate(360deg); }
}

.group-heading[b-yid1wzsy40] {
    margin: 20px 0 8px;
    padding-bottom: 6px;
    border-bottom: 2px solid #93c355;
    font-size: 13px;
    font-weight: 700;
    color: #111827;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.group-heading:first-child[b-yid1wzsy40] {
    margin-top: 0;
}

.group-heading-muted[b-yid1wzsy40] {
    border-bottom-color: #d1d5db;
    color: #6b7280;
}

.entry-card[b-yid1wzsy40] {
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 14px 16px;
    margin-bottom: 12px;
    background: #ffffff;
}

.entry-title[b-yid1wzsy40] {
    font-size: 14px;
    font-weight: 700;
    color: #111827;
    margin-bottom: 10px;
}

.entry-field[b-yid1wzsy40] {
    margin-bottom: 10px;
}

.entry-field label[b-yid1wzsy40] {
    display: block;
    font-size: 11px;
    color: #6b7280;
    margin-bottom: 3px;
}

.entry-field-row[b-yid1wzsy40] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.entry-value[b-yid1wzsy40] {
    flex: 1;
    padding: 6px 10px;
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    font-family: Consolas, ui-monospace, monospace;
    font-size: 13px;
    color: #111827;
    overflow-wrap: anywhere;
}

.entry-secret[b-yid1wzsy40] {
    letter-spacing: 0.05em;
}

.btn-icon[b-yid1wzsy40] {
    background: transparent;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    width: 30px;
    height: 30px;
    cursor: pointer;
    font-size: 14px;
    line-height: 1;
}

.btn-icon:hover[b-yid1wzsy40] {
    background: #f3f4f6;
}

.btn-icon-flash[b-yid1wzsy40] {
    background: #dcfce7;
    border-color: #16a34a;
    color: #166534;
}

.warning-box[b-yid1wzsy40] {
    margin: 0 0 14px;
    padding: 10px 12px;
    background: #fef3c7;
    border: 1px solid #f59e0b;
    border-radius: 8px;
    font-size: 12px;
    color: #92400e;
    line-height: 1.5;
}

.entry-link[b-yid1wzsy40] {
    color: #2563eb;
    text-decoration: underline;
    font-size: 13px;
    overflow-wrap: anywhere;
}

.entry-notes[b-yid1wzsy40] {
    margin: 0;
    padding: 8px 10px;
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    font-size: 13px;
    color: #374151;
    white-space: pre-wrap;
}

.share-card-footer[b-yid1wzsy40] {
    padding: 14px 24px 18px;
    border-top: 1px solid #e5e7eb;
    text-align: center;
    font-size: 11px;
    color: #6b7280;
}

.share-card-footer a[b-yid1wzsy40] {
    color: #6b7280;
    text-decoration: underline;
}

.share-version[b-yid1wzsy40] {
    margin-top: 5px;
    font-size: 10px;
    letter-spacing: .02em;
    opacity: .65;
}

.entries-header[b-yid1wzsy40] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
    gap: 8px;
}

.entries-header h2[b-yid1wzsy40] {
    margin: 0;
}

.btn-secondary[b-yid1wzsy40] {
    background: #ffffff;
    color: #111827;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    padding: 7px 12px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s ease;
}

.btn-secondary:hover[b-yid1wzsy40] {
    background: #f3f4f6;
}

/* ─── Mobile: roomier touch targets, edge-to-edge card ─────────────────── */
@media (max-width: 480px) {
    .share-page[b-yid1wzsy40] {
        padding: 0;
        align-items: stretch;
    }

    .share-card[b-yid1wzsy40] {
        border-radius: 0;
        border-left: 0;
        border-right: 0;
        max-width: 100%;
    }

    .share-card-header[b-yid1wzsy40] { padding: 18px 16px 12px; }
    .share-meta[b-yid1wzsy40],
    .banner[b-yid1wzsy40]       { margin-left: 16px; margin-right: 16px; }
    .share-step[b-yid1wzsy40]   { padding: 8px 16px 20px; }

    /* Bigger touch targets per Apple/Material guidelines (~44px). */
    .btn-primary[b-yid1wzsy40]  { padding: 13px 20px; font-size: 15px; width: 100%; }
    .btn-secondary[b-yid1wzsy40] { padding: 11px 14px; font-size: 14px; min-height: 40px; }
    .btn-icon[b-yid1wzsy40]     { width: 40px; height: 40px; font-size: 16px; }

    .code-input[b-yid1wzsy40] { font-size: 26px; padding: 12px 14px; max-width: 100%; }

    .entry-card[b-yid1wzsy40] { padding: 12px 14px; }
    .entry-value[b-yid1wzsy40] { font-size: 13px; padding: 8px 12px; min-height: 40px; display: flex; align-items: center; }

    .entries-header[b-yid1wzsy40] {
        flex-direction: column;
        align-items: stretch;
    }
}

.print-only[b-yid1wzsy40] { display: none; }

/* Named page keeps document margins/footer specific to verified credential shares.
   Margin boxes repeat without overlapping entries and supply real page counts. */
@page share-credentials {
    size: A4 portrait;
    margin: 18mm 18mm 25mm;

    @bottom-left {
        content: "flexbit nexus\A Vertraulich · Bitte bewahren Sie dieses Dokument sicher auf.";
        white-space: pre-line;
        font: 8pt/1.6 Arial, Helvetica, sans-serif;
        color: #465054;
        border-top: 0.3pt solid #d1d5db;
        padding-top: 3mm;
        vertical-align: top;
    }
    @bottom-right {
        content: "Seite " counter(page) " / " counter(pages);
        font: 8pt/1.6 Arial, Helvetica, sans-serif;
        color: #465054;
        border-top: 0.3pt solid #d1d5db;
        padding-top: 3mm;
        vertical-align: top;
    }
}

@media print {
    .print-only[b-yid1wzsy40] { display: block !important; }
    .share-page[b-yid1wzsy40] {
        display: block;
        min-height: 0;
        background: #fff;
        padding: 0;
        color: #222;
        font: 10pt/1.45 Arial, Helvetica, sans-serif;
    }
    /* Named page must be assigned on the outermost box (body), not .share-page — assigning it
       deeper causes a page-name change relative to the (unnamed) ancestor context, which the
       CSS Paged Media spec treats as a forced break and inserts a blank leading page. */
    body:has(.share-print-header)[b-yid1wzsy40] { page: share-credentials; }
    .share-card[b-yid1wzsy40] { border: 0; border-radius: 0; max-width: none; overflow: visible; }
    .share-page:has(.share-print-header) .share-card-header[b-yid1wzsy40],
    .share-card-accent[b-yid1wzsy40],
    .share-card-footer[b-yid1wzsy40],
    .share-meta[b-yid1wzsy40],
    .banner[b-yid1wzsy40],
    .btn-icon[b-yid1wzsy40],
    .no-print[b-yid1wzsy40] { display: none !important; }
    .share-step[b-yid1wzsy40] { padding: 0; counter-reset: credential; }
    .share-print-header[b-yid1wzsy40] { break-inside: avoid; break-after: avoid; margin-bottom: 5mm; }
    .print-brand-row[b-yid1wzsy40] {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        border-bottom: 1.5pt solid #93c355;
        padding-bottom: 6mm;
        margin-bottom: 8mm;
        print-color-adjust: exact;
        -webkit-print-color-adjust: exact;
    }
    .print-brand img[b-yid1wzsy40] { display: block; width: 38mm; height: auto; }
    .print-brand span[b-yid1wzsy40] { display: block; color: #465054; font-size: 12pt; letter-spacing: .18em; margin-top: 1mm; }
    .print-document-label[b-yid1wzsy40] { text-align: right; font-size: 9pt; color: #465054; line-height: 1.9; }
    .share-print-header h1[b-yid1wzsy40] { margin: 0 0 1mm; font-size: 27pt; line-height: 1.2; color: #465054; }
    .share-print-header > p[b-yid1wzsy40] { margin: 0; font-size: 12pt; color: #465054; }
    .print-summary[b-yid1wzsy40] { display: flex; gap: 10mm; margin: 8mm 0 0; padding-bottom: 6mm; }
    .print-summary > div + div[b-yid1wzsy40] { border-left: .5pt solid #d1d5db; padding-left: 8mm; }
    .print-summary dt[b-yid1wzsy40] { font-size: 9pt; font-weight: 700; }
    .print-summary dd[b-yid1wzsy40] { margin: 1mm 0 0; overflow-wrap: anywhere; }
    .group-heading[b-yid1wzsy40] {
        margin: 20mm 0 4mm;
        padding-bottom: 2mm;
        border-bottom: 2pt solid #629b32;
        font-size: 12pt;
        letter-spacing: 0.08em;
        color: #465054;
        break-after: avoid;
        break-inside: avoid;
        print-color-adjust: exact;
        -webkit-print-color-adjust: exact;
    }
    .group-heading + .entry-card[b-yid1wzsy40] {
        break-before: avoid;
    }
    .share-print-header + .group-heading[b-yid1wzsy40],
    .group-heading:first-of-type[b-yid1wzsy40] { margin-top: 0; }
    .group-heading-muted[b-yid1wzsy40] { border-bottom-color: #d1d5db; color: #6b7280; }
    .entry-card[b-yid1wzsy40] {
        counter-increment: credential;
        position: relative;
        break-inside: avoid;
        page-break-inside: avoid;
        border: 0;
        border-top: .5pt solid #d1d5db;
        border-radius: 0;
        padding: 5mm 0 5mm 13mm;
        margin: 0;
        background: #fff;
    }
    .entry-title[b-yid1wzsy40] { font-size: 12pt; margin: 0 0 4mm; overflow-wrap: anywhere; break-after: avoid; }
    .entry-title[b-yid1wzsy40]::before {
        content: counter(credential, decimal-leading-zero);
        position: absolute;
        left: 0;
        color: #629b32;
        print-color-adjust: exact;
        -webkit-print-color-adjust: exact;
    }
    .entry-field[b-yid1wzsy40] { display: grid; grid-template-columns: 36mm minmax(0, 1fr); gap: 2mm; margin-bottom: 2.5mm; }
    .entry-field:last-child[b-yid1wzsy40] { margin-bottom: 0; }
    .entry-field label[b-yid1wzsy40] { font-size: 10pt; color: #465054; margin: 0; }
    .entry-field-row[b-yid1wzsy40] { display: block; min-width: 0; }
    .entry-value[b-yid1wzsy40], .entry-link[b-yid1wzsy40] {
        background: transparent;
        border: 0;
        border-radius: 0;
        padding: 0;
        font: 10pt/1.45 Consolas, "Courier New", monospace;
        color: #222;
        letter-spacing: normal;
        overflow-wrap: anywhere;
        white-space: pre-wrap;
        min-height: 0;
    }
    .entry-link[b-yid1wzsy40] { text-decoration: none; }
    .share-step .entry-notes[b-yid1wzsy40] { margin: 0; padding: 0; border: 0; background: transparent; font-size: 10pt; line-height: 1.45; overflow-wrap: anywhere; }
    .share-step .entry-unknown[b-yid1wzsy40] { font-size: 9pt; }
    .entry-unknown strong[b-yid1wzsy40] { font-size: 10pt; }
}